import { Component, OnInit } from '@angular/core';
import { ResumeService } from '../../../../service/resumeService';
import * as jsPDF from "jspdf";
import html2canvas from 'html2canvas';

@Component({
  selector: 'app-profiles',
  templateUrl: './profiles.component.html',
  styleUrls: ['./profiles.component.css']
})
export class ProfilesComponent implements OnInit {

  cols:any[];
  resumes:any[];
  isDisplay:any = false;

  //resume
  name:string = "";
  sex :string = "";
  grade :string = "";
  academy: string = "";
  qq: string = "";
  weixin: string = "";
  phone: string = "";
  email:string = "";
  choices:any[];
  choice:string = "";
  experience:string = "";
  expert:string="";
  why:string ="";
  suggestion:string = "";
  constructor(public resumeService:ResumeService) { }

  ngOnInit(): void {
    this.cols = [
      { field: 'index', header: '序号' },
      { field: 'name', header: '姓名' },
      { field: 'sex', header:'性别'},
      { field: 'grade', header:'年级'},
      { field: 'academy', header:'学院'},
      { field: 'choice', header:'填报方向'},
      { field: 'date', header:'提交时间'}
    ];
    this.getAllResumes();
  }

  getAllResumes(){
    this.resumeService.getAll().subscribe(datas=>{
      this.resumes = datas;
      for(let i = 0;i<datas.length;i++){
        this.resumes[i].index = i+1;
      }
    })
  }

  renderResume(data){
    //resume
    this.name = data.name;
    this.sex = data.sex;
    this.grade = data.grade;
    this.academy = data.academy;
    this.phone = data.phone;
    this.email = data.email;
    this.choice = data.choice;
    this.experience = data.experience;
    this.expert = data.expert;
    this.why = data.why;
    this.suggestion = data.suggestion;
    this.isDisplay  = true;
  }
  deleteResume(data){
    console.log(data);
    this.resumeService.deleteResume(data.id).subscribe(response=>{
        console.log(response);
        this.getAllResumes();
        alert("删除成功");
    },
    error=>{
      alert("删除失败");
    })
  }

  generatePDF(){
    var target = document.querySelector("article");

    html2canvas(target,{scrollX:0, scrollY: -window.scrollY}).then(canvas=>{
      var contentWidth = canvas.width;
      var contentHeight = canvas.height;

      //一页pdf显示html页面生成的canvas高度;
      var pageHeight = contentWidth / 592.28 * 841.89;
      //未生成pdf的html页面高度
      var leftHeight = contentHeight;
      //页面偏移
      var position = 0;
      //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
      var imgWidth = 595.28;
      var imgHeight = 592.28/contentWidth * contentHeight;

      var pageData = canvas.toDataURL('image/jpeg', 1.0);

      var pdf = new jsPDF('', 'pt', 'a4');

      //有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
      //当内容未超过pdf一页显示的范围，无需分页
      if (leftHeight < pageHeight) {
      pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight );
      } else {
          while(leftHeight > 0) {
              pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
              leftHeight -= pageHeight;
              position -= 841.89;
              //避免添加空白页
              if(leftHeight > 0) {
                pdf.addPage();
              }
          }
      }
      if((this.name == null || this.name == "") || (this.choice == null || this.choice == "")){
        pdf.save("北航机器人队报名表.pdf");
      }
      else{
        pdf.save(this.choice + "_" + this.name + ".pdf");
      }
  })
  }

  back(){
    this.isDisplay = false;
  }
}
